import { Menu } from 'antd';
import { MailOutlined, AppstoreOutlined, IssuesCloseOutlined } from '@ant-design/icons';
import React from 'react';
import { Layout } from 'antd';
import { useNavigate, Outlet } from 'react-router-dom';
const { Header, Footer, Sider, Content } = Layout;

function ZwRouter(props) {

    //-------------------------------------------☃️-----以 key 属性值跳转路由-----☃️-------------------------------------------

    var push = useNavigate();

    const goKeyrouter = function ({ item, key, keyPath, domEvent }) {
        //-----🍌---🍌---🍌-----
        push(key);
    }

    //-------------------------------------------☃️-----以 key 属性值跳转路由-----☃️-------------------------------------------
    return (
        <div>
            <Menu theme='dark' mode="inline" defaultSelectedKeys={['key']}>
                <Menu.SubMenu onClick={goKeyrouter} key="SubMenu" title="权限管理" icon={<IssuesCloseOutlined />}>
                    <Menu.Item key="/index/StaffManage" >
                        员工管理
                    </Menu.Item>
                    <Menu.Item key="/index/CompanyBuild" >
                        公司架构
                    </Menu.Item>
                    <Menu.Item key="/index/LimitPlan" >
                        权限分配
                    </Menu.Item>
                </Menu.SubMenu>
            </Menu>
        </div>
    );
}

export default ZwRouter;